<template>
  <a-form  :form="form" :label-col="{ span: 5 }" :wrapper-col="{ span: 12 }" @submit="handleSubmit" >
    <div v-for="(v,k) in data" :key="k">
        <a-form-item :label="k">
            <a-input
            v-decorator="[v, { rules: [{ required: true, message: '请输入'+k }] }]"
            />
    </a-form-item>
    用户名:<input type="text">
    密码: <input type="text">


    </div>
   <h1>登录页面</h1>
    用户名:<input type="text" v-model="username">
    <br>
    <br>
    密码: <input type="text" v-model="password" id="aa2">
    <br>
    <br>
    <a-button type="primary" @click="btn">
        登陆
      </a-button>
      <a-button type="primary" @click="oauth">
        <a :href="weibo_url"><i class="fa fa-weibo"></i></a>
        微博登陆
      </a-button>
    <br>
    <br>
    <!-- <a-form-item :wrapper-col="{ span: 12, offset: 5 }">

      <a-button type="primary" html-type="submit" id="aa1" @click="btn">
        登陆
      </a-button>



    </a-form-item> -->
    <button> <router-link :to="{'path':'/register'}">注册</router-link> </button>
    &nbsp;&nbsp;&nbsp;&nbsp;
      <button><router-link :to="{'path':'/Email'}">忘记密码</router-link></button>
  </a-form>
</template>


<script>
import axios from 'axios'
export default {
  props:["data"],
  data() {
    return {
      weibo_url:'',
        username:'',
        password:'',
        uid:'',
      formLayout: 'horizontal',
      form: this.$form.createForm(this, { name: 'coordinated' }),
    };
  },
  methods: {
    // 获取微博登录地址
    oauth() {
      console.log(1)
      // 从后端获取 微博登录地址
      axios.post('http://127.0.0.1:8000/oauth/weibo/').then((resp) => {
        console.log("调用获取微博url")
        //{'code': '0', 'msg': '成功', 'data': {'url': url}}
        let url = resp.data.data.url;
        console.log(url)
        // this.weibo_url = url;
           window.location.href = url;
      })


    },
    // 新浪微博登录
    sina: function () {
      // 组装url
      let url = "https://api.weibo.com/oauth2/authorize?client_id=3909184723&redirect_uri=" + config['baseurl'] + "weibo/";
      // 进行跳转
      window.location.href = url;
    },
    btn(){
      axios.post('http://127.0.0.1:8000/user/login/',{'username':this.username,'password':this.password}).then(res=>{
        console.log(res.data)
        localStorage.setItem('token',res.data.token)
        localStorage.setItem('username',res.data.username)
        localStorage.setItem('uid',res.data.id)
        this.$router.push("/")

      })
    },
    handleSubmit(e) {
      e.preventDefault();
      this.form.validateFields((err, values) => {
        if (!err) {
          console.log('Received values of form: ', values);
        }
      });
    },
    handleSelectChange(value) {
      console.log(value);
      this.form.setFieldsValue({
        note: `Hi, ${value === 'male' ? 'man' : 'lady'}!`,
      });
    },
  },
  mounted() {
    // this.oauth()
  },
};
</script>
<style>
#aa1{
    margin-left:135px;
}
#aa2{
    margin-left: 15px;
}
#aa3{
    margin-left: 50px;
}
</style>
